<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>欢迎</title>
    <th:block th:include="include::header"/>
</head>
<body>
<div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">首页</a>
                <a href="">演示</a>
                <a>
                    <cite>导航元素</cite></a>
            </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
    </a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
<!--                    <form class="layui-form layui-col-space5">-->
<!--                        <div class="layui-inline layui-show-xs-block">-->
<!--                            <select name="type" lay-verify="" id="Stype" onclick="change()">-->
<!--                                <option value="1">编号</option>-->
<!--                                <option value="2">生产批号</option>-->
<!--                            </select></div>-->
<!--                        <div class="layui-inline layui-show-xs-block">-->
<!--                            <input id="input" type="text" name="va" placeholder="请输入内容" autocomplete="off"-->
<!--                                   class="layui-input"></div>-->
<!--                        <div class="layui-inline layui-show-xs-block">-->
<!--                            <button class="layui-btn" lay-submit="" lay-filter="search">-->
<!--                                <i class="layui-icon">&#xe615;</i>-->
<!--                            </button>-->
<!--                        </div>-->
<!--                    </form>-->
                </div>
                <div class="layui-card-header">
                    <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除
                    </button>
                    <button class="layui-btn" th:onclick="|xadmin.open('添加','@{/plan/add}',800,500)|"><i
                            class="layui-icon"></i>添加
                    </button>
                </div>
                <div class="layui-card-body ">
                    <table class="layui-hide" id="planTable"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<div>

</div>
</body>

<script type="text/html" id="baidu">
    <a onclick="xadmin.open('编辑','/plan/info/?craft={{d.craft}}',600,400)" href="javascript:;">
        <i style="color:blue">{{d.craft}}</i>
    </a>
</script>

<script>
    var tableIns;

    layui.use(['table', 'form'], function () {
        var table = layui.table;
        var form = layui.form;

        tableIns = table.render({
            elem: '#planTable',
            url: '/plan/list',
            method: "post",
            cols: [
                [
                    {type: 'checkbox'},
                    {field: 'id', width: 80, title: '编号', sort: true},
                    {field: 'batch', title: '生产批号'},
                    {field: 'total', title: '投产数量'},
                    {field: 'begin', title: '开始日期'},
                    {field: 'end', title: '结束日期'},
                    {field: 'link', title: '工艺',templet: '#baidu'},
                    {
                        field: 'action', width: 150, title: '操作', templet(d) {
                            // 反引号 ，在里面写字符串可以换行
                            //          取变量， ${}
                            var edit = `${ctx}/plan/edit?id=${d.id}`;
                            return `
                                <div class="td-manage">
                                      <a title="编辑"  onclick="xadmin.open('编辑:${d.id}','${edit}',600,400)" href="javascript:;">
                                        <i class="layui-icon">&#xe642;</i>
                                      </a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                      <a title="删除" onclick="userDel(${d.id})" href="javascript:;">
                                        <i class="layui-icon">&#xe640;</i>
                                      </a>
                                </div>
                            `
                        }
                    },
                ]
            ],
            page: true,
            parseData(res) {
                return {
                    "code": res.success ? 0 : 500,
                    "msg": res.msg,
                    "count": res.data.total,
                    "data": res.data.list
                }
            }
        });
//监听提交
        form.on('submit(search)',
            function (data) {
                var stype = document.getElementById("Stype").value;
                console.log(document.getElementById("Stype").value);
                console.log(data.field);
                tableIns.reload({
                    where: {
                        va: data.field.va,
                        type: data.field.type
                    },
                    page: {
                        curr: 1
                    }
                })
                console.log(data.field);
                return false;
            });
    });

    function userDel(id) {
        layer.confirm('确认要删除吗？', function (index) {
            $.ajax({
                url: ctx + '/plan/delete/' + id,
                type: 'delete',
                success(res) {
                    if (res.success) {
                        layer.msg(res.msg);
                        setTimeout(function () {
                            tableIns.reload();
                        }, 500);
                    }else {
                        if(res.msg==null){
                            layer.msg(res,{icon:2,time:2000});
                        }else {
                            layer.msg(res.msg,{icon:2,time:2000});
                        }
                    }
                }
            })
        });
    }

    function delAll() {
        var checkStatus = layui.table.checkStatus('planTable');
        var data = checkStatus.data;
        console.log(data);
        data = checkStatus.data;
        allId = "";
        if (data.length == 0) {
            layer.alert("请至少选择一项")
        }
        if (data.length > 0) {
            for (var i in data) {
                allId += data[i].id + ",";
            }
            console.log(allId);
            // layer.confirm('确认要删除吗？', function (index) {
            //     //发异步删除数据
            //     layer.msg('已删除!', {icon: 1, time: 1000});
            //     $(".layui-form-checked").not('.header').parents('tr').remove();
            //     $.post('alldel1', {ids: allId})
            // });
            layer.confirm('确认要删除吗？', function (index) {
                $.ajax({
                    url: ctx + '/work/delAll/' + allId,
                    type: 'delete',
                    success(res) {
                        console.log("1" + res);
                        if (res.success) {
                            layer.msg(res.msg);
                            setTimeout(function () {
                                tableIns.reload();
                            }, 500);
                        }
                    }
                })
            });
        }

    }

</script>

</html>